import React, { useState } from 'react'
import DefaultList from './componets/DefaultList'
import SearchList from './componets/SearchList'

const Search = () => {
  const [text, setText] = useState('')

  const changeText = e => {
    setText(e.target.value)
  }

  return (
    <div className="page search-page">
      <header>
        <p>
          <i className="iconfont icon-fangdajing"></i>
          <input type="text" value={text} onChange={changeText} placeholder="搜索" />
        </p>
        <span>取消</span>
      </header>
      <main>
        {text ? <SearchList text={text} /> : <DefaultList />}
      </main>
    </div>
  )
}

export default Search
